/* ------------------------------
  CodeMirror Tooltip
--------------------------------- */
.code-tooltip {
  margin-top: 0.5rem;
  margin-bottom: 1rem;
}

.code-tooltip hr {
  margin-top: 5px;
  margin-bottom: 5px;
}

.code-tooltip p {
  margin-bottom: 10px;
}

.code-tooltip pre {
  padding: 10px;
  background: #333;
  border-radius: 5px;
  margin-bottom: 10px;
}

.code-tooltip table {
  margin-top: 10px;
  border-collapse: collapse;
}

.code-tooltip td,
.code-tooltip th {
  padding: 5px;
  text-align: left;
  border: 2px solid #ccc;
}

.cm-tooltip-cursor {
  overflow-y: auto;
  max-height: 600px;
  user-select: text;
}

.cm-completionIcon-property::after {
  content: "🆔" !important;
}

.cm-completionIcon-enum::after {
  content: "❝" !important;
}

.cm-completionIcon-keyword::after {
  content: "🔑" !important;
}

.cm-completionIcon-table::after {
  display: block !important;
  background-size: contain !important;
  content: "" !important;
  background-image: url("") !important;
  width: 20px !important;
  height: 20px !important;
  background-position: center;
  background-repeat: no-repeat;
}

.cm-completionIcon-function::after,
.cm-completionIcon-method::after,
.cm-completionIcon-variable::after,
.cm-completionIcon-namespace::after,
.cm-completionIcon-interface::after {
  content: "⚡" !important;
}

.cm-tooltip-autocomplete > ul > li {
  display: flex;
}

.cm-tooltip-autocomplete > ul > li > .cm-completionIcon {
  width: 1em !important;
  display: flex;
  align-self: center;
  justify-content: center;
}

.cm-tooltip-autocomplete .cm-completionLabel {
  flex-grow: 1;
}

.cm-tooltip-autocomplete .cm-completionDetail {
  padding-left: 15px;
}
